CSS type selector
Home

CSS type selector

CSS type selector

Een type-selector bestaat uit één of meer elementen waarop de stijlregel van toepassing is.

Beschrijving

In de meest eenvoudige vorm is een enkel element de selector. Meerdere elementen waarvoor dezelfde stijl geldt, kunnen in een door komma's gescheiden lijst gegroepeerd worden. Verder zijn er combinaties voor descendent en child element-selectors, waarbij de stijl alleen toegepast wordt als een element is opgenomen in een ander element. Bij adjacent sibling element-selectors gaat het om elementen die direct op elkaar volgen. Tenslotte kennen we nog de universele selector.

Stijlregels met element-selectors worden opgenomen in een stijlblok in de head van een document, of in een extern stijlblad.

De naam van een element-selector is hoofdletterongevoelig. Dat wil zeggen dat het niet uitmaakt of de naam in hoofdletters of in kleine letters wordt geschreven.

Enkelvoudige type-selector

In het Hoe schrijf ik het zijn we één selector h1 tegengekomen.

h1 {
   color: orange;
}

Dat betekent dat de stijlregel van toepassing is op alle h1 elementen van de webpagina en dat dus de kleur van de letters in het oranje weergegeven zullen worden.

Type-selector lijst

Deze stijlregel bepaalt gemeenschappelijke eigenschappen voor het html en body element:

body, html {
   min-height: 100%
}

De volgende stijlregel bepaalt gemeenschappelijke eigenschappen voor alle titels:

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 20px;
    font-weight: 700
}

JI
2016-12-07 12:53:10